import React from "react";
import styles from "./Loading.module.css";

interface LoadingProps {
  /**
   * 颜色
   * @default #fff
   */
  color?: string;
  /**
   * 大小
   * @default 80
   */
  size?: number;
}
const DefaultColor = "#fff";

/**
 * 原始大小
 */
const LoadingOriginalSize = 80;

const Loading: React.FC<LoadingProps> = ({
  color = DefaultColor,
  size = LoadingOriginalSize,
}) => {
  const style = {
    "--loading-color": color,
    zoom: `calc(${size}/${LoadingOriginalSize})`,
  } as any;
  return (
    <div className={styles.loading} style={style}>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
    </div>
  );
};

export default Loading;
